<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>14按钮</title>
    <link rel="stylesheet" href="css/bootstrap.min.css">
</head>
<body>
      <!--原本的html样式-->
      <div>
        <button>按钮</button>
      </div>
      <br>

<!--      加上bootstrap的样式-->
      <div>
        <button class="btn">按钮</button>
        <button class="btn btn-default">默认</button>
        <button class="btn btn-danger">危险</button>
        <button class="btn btn-primary">主要</button>
        <button class="btn btn-success">成功</button>
        <button class="btn btn-info">信息</button>
        <button class="btn btn-warning">警告</button>
        <button class="btn btn-link">链接</button>

        <button class="btn btn-block">按钮</button>
      </div>

      <br>

<!--      按钮的大小-->
      <div>
          <button class="btn btn-lg">大按钮</button>
      </div>

<!--      其他的标签也可以变成按钮-->
      <a href="https://www.baidu.com" class="btn btn-primary">a标签也可以变成按钮</a>

      <br>

      <div>
          <button class=" btn btn-danger" onclick="alert('hello!')" disabled>真正禁用</button>
          <button class="btn btn-warning disabled"  onclick="alert('不能禁用！')">虚假禁用</button>
      </div>


     <script type="text/javascript" src="js/jquery.min.js"></script>
     <script type="text/javascript" src="js/bootstrap.min.js"></script>
</body>
</html>